/*
 * @Description:
 * @Autor: lcz
 * @Date: 2022-08-26 19:44:14
 * @LastEditors: lcz
 * @LastEditTime: 2022-08-29 10:45:40
 */
import { useMemo, useRef, useEffect, useState } from 'react'
import { Workbook, WorkbookInstance } from '@fortune-sheet/react'
import '@fortune-sheet/react/dist/index.css'

const ExcelCom = () => {
  const WorkbookRef = useRef<WorkbookInstance>(null)
  const boxRef = useRef(null)
  const [data, setData] = useState([])
  useEffect(() => {
    let celldataLocal = localStorage.getItem('name')
    let celldata = celldataLocal
      ? JSON.parse(celldataLocal)
      : [
          {
            name: 'Sheet1',
            id: '0',
            index: '0',
            scrollTop: 418,
            scrollLeft: 0,
            order: 0,
            celldata: [
              {
                r: 0,
                c: 0,
                v: null,
              },
            ],
          },
        ]
    setData(celldata)
  }, [])
  // const settings = useMemo(() => {}, [])
  const save = () => {
    let value = JSON.stringify(WorkbookRef.current?.getAllSheets())
    localStorage.setItem('name', value)
  }
  return (
    <div
      style={{
        width: '100%',
        height: `calc(100vh)`,
      }}
      ref={boxRef}
    >
      {data.length>0 && <Workbook data={data}  ref={WorkbookRef} />}
      <div onClick={save}>保存数据</div>
    </div>
  )
}
export default ExcelCom
